<template>
  <div class="homeHead">
    <div class="cate" @click="$router.push('/cate')">
      <van-icon name="category" color="#fff" size="20" class-prefix="icon" class="iconfont"></van-icon>
      <span class="cateTitle">分类</span>
    </div> 
    <div class="search" @click="$router.push('/search')">
      <van-icon name="search" color="#fff" class-prefix="icon" class="iconfont"></van-icon>
      <span>搜索商品</span>
    </div>
  </div>
</template>

<script>
export default {
    
}
</script>

<style lang="scss" scoped>
.homeHead{
  height: 50px;
  background:#f66;
  width:100%;
  padding:0 10px;
  position: fixed;
  box-sizing: border-box;
  left:0;
  top:0;
  z-index:2;
  display: flex;
  align-items: center;
  .cate{
    color: #fff;
    font-size: 16PX;
    display: flex;
    flex-direction: column;
    padding-right:10px;
    align-items: center;
    justify-content: center;
  }
  .search{
    background: rgba(255,255,255,.2);
    flex:1;
    height:30px;
    font-size: 16PX;
    color:#fff;
    display:flex;
    align-items: center;
    border-radius: 15px;
    .iconfont{
      margin:0 10px;
    }
  }
}
</style>
